<template>
  <div class="toast" v-show="isShow">
    <div>
        {{message}}
    </div>

  </div>
</template>

<script>

  export default {
    name: "CartListItem",
    data() {
        return {
            message: "",
            isShow: false
        }
    },
    methods: {
        show(message , duration){
            this.isShow = true
            this.message = message
            setTimeout(() => {
                this.isShow     = true
                this.message    = ""
            },duration)
        }
    }
  }
</script>

<style scoped>
    .toast {
        position: fixed;
        top:50%;
        left : 50%;
        transform:  translate( -50% , -50%);


        color: white;
        background-color: rgba(0,0,0, .7);
    }
</style>
